<template>
	<div>
		<van-sidebar>
			<van-sidebar-item title="热门搜索" />
		</van-sidebar>
		<van-button
			class="btn"
			v-for="(item, index) in searchList"
			:key="index"
			round
			type="info"
			@click="handle(item.first)"
		>
			{{ item.first }}
		</van-button>
	</div>
</template>

<script>
import { mapState, mapActions } from "vuex";
export default {
	data() {
		return {};
	},
	computed: {
		...mapState("hotSearch", ["searchList"]),
	},
	methods: {
		handle(value) {
			this.$emit("add", value);
		},
		...mapActions("hotSearch", ["updateSearchList"]),
	},
	created() {
		this.updateSearchList();
	},
};
</script>
<style scoped>
.btn {
	height: 30px;
	border: 1px solid rgb(155, 137, 137);
	background-color: #fff;
	color: #333;
	margin: 4px;
}
</style>